<template>
  <el-dialog title="批量积分导入结果" :model-value="show" width="300px" :before-close="close">
    <div class="uploadExcel" v-loading="loading">
      <div class="resultTips" style="text-align: center;">
        <el-result icon="error" v-if="result.fail"></el-result>
        <el-result icon="success" v-else></el-result>
        <span>
          导入成功<span class="success">{{ result.successNum || 0 }}</span>条</span>
        <span>
          导入失败<span class="fail" style="color: #ff3b30;">{{ result.failNum || 0 }}</span>条
        </span>
        <div v-if="result.failDataUrl"> <el-button type="primary" link @click.stop="downloadRecord">下载失败记录</el-button>
        </div>
      </div>
    </div>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="close">完成</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
const props = defineProps({
  show: {
    type: Boolean,
    default: false
  },
  result: {
    type: Object,
    default: () => ({})
  },
  loading: {
    type: Boolean,
    default: false
  }
})

const emits = defineEmits(['update:show', 'close', 'update:loading',])
const close = () => {
  emits('update:show', false)
  emits('update:loading', false)
  emits('close')

}
const downloadRecord = () => {
  if (props.result.failDataUrl) {
    const reg = /\s+[.[]\s*|\s*[.[]\s+/g
    //修改链接空格格式
    const url = (props.result.failDataUrl + "").trim().replace(reg, s => s.trim())
    let a = document.createElement("a");
    a.setAttribute("href", url);
    a.setAttribute("download", "积分导入失败结果.xlsx");
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
  }
}
</script>
<style lang="scss" scoped></style>